page {
  width: 100%;
  box-sizing: border-box;
  background-color: #f6f6f6;
}

.container {
  height: 100%;
  box-sizing: border-box;
} 

.list {
  padding-left: 10rpx;

  .item {
    position: relative;
    line-height: 40rpx;
    padding-left: 28rpx;

    &:before {
      content: '';
      position: absolute;
      top: 15rpx;
      left: 0;
      display: block;
      width: 12rpx;
      height: 12rpx;
      border-radius: 50%;
      border: 4rpx solid #555;
      box-sizing: border-box;
    }

    + .item {
      margin-top: 16rpx;
    }
  }

  &--inner {
    margin: 24rpx 0;
  }
}

.text {

  &--bold {
    font-weight: bolder;
  }

  &--code {
    background: #e6eefb;
    color: #0052d9;
    padding: 0 4px;
    border-radius: 4px;
  }

  &--image {
    font-family: 't';
    color: #333;
    text-decoration: underline;

    &::before {
      content: '\E074';
    }
  }

  &--link {
    font-family: 't';
    text-decoration: underline;

    &:before {
      content: '\E07C';
    }
  }

  &--page {
    font-family: 't';
    text-decoration: underline;

    &:before {
      content: '\E058';
    }
  }

  &--quote {
    display: block;
    padding: 12rpx;
    font-size: 28rpx;
    color: #0052d9;
    background-color: #e6eefb;
    opacity: .7;
    border-radius: 8rpx;
  }
}